import { PDFTableHeaderOption } from "."

const thCssStyle: Partial<CSSStyleDeclaration> = {

}

/**
 * HTML方式
 * @param headers 
 * @param table 
 */
export function createTableHeaderHtml(headers: PDFTableHeaderOption[], table: HTMLTableElement) {
  const ths = [] as HTMLTableCellElement[]
  headers.forEach(item => {
    const th = document.createElement('th')
    th.innerText = item.label
    if(item.width) {
      th.style.width = typeof(item.width) === 'number' ? `${item.width}px` : item.width
    }

    Object.keys(thCssStyle).forEach((key: any) => {
      (th.style as any)[key] = thCssStyle[key]
    })
    ths.push(th)
  })
  const thead = document.createElement('thead')
  const tr = document.createElement('tr')
  tr.style.height = '60px'
  tr.append(...ths)

  thead.appendChild(tr)
  table.appendChild(thead)
}

export function createTableBodyHtml(data: any[], headers: PDFTableHeaderOption[], table: HTMLTableElement) {
  const tbody = document.createElement('tbody')
  const trs = [] as HTMLTableRowElement[]
  data.forEach((item) => {
    const tr = document.createElement('tr')
    headers.forEach(header => {
      const td = document.createElement('td')
      td.innerText = item[header.prop]
      td.style.padding = '6px 20px'
      tr.appendChild(td)
    })
    trs.push(tr)
  })
  tbody.append(...trs)
  table.appendChild(tbody)
}